<ul>
  <li ng-repeat="item in list" compile-dom></li>
</ul>
<div class="alert alert-danger" role="alert">
  compile: 可以更改DOM元素，或者注册DOM事件，也可直接返回一个postLink函数，这个函数就是一个link链接函数
</div>
<pre>
  zppdirective.directive('compileDom', function(){
            return {
              restrict: 'EA',
              replace: true,
              template: '<p>{{item.name}}</p>',

              // 定义了compile就不需要定义link,当compile返回一个方法这个方法就是link
              // tElement 正在执行该指令的当前dom元素的jquery对象
              // tAttrs 正在执行该指令的当前dom元素的属性
              compile: function(tElement, tAttrs, transclude){
                console.log('编译阶段开始执行');
                // 改变当前元素的DOM结构
                tElement.append(angular.element('<span>我是添加进来的</span>'));
                return {
                  // pre:编译阶段执行
                  pre: function preLink(scope, iElement, iAttrs, controller) {
                    console.log('preLink...');
                  },
                  // post: 所有子元素指令的post都执行后执行
                  post: function postLink(scope, iElement, iAttrs, controller){
                    iElement.on('click', function(){
                      scope.item.name = 'click aaa'
                      scope.$apply();
                    })
                    console.log('postLink ....');
                  }

                };//return
                //  compile直接返回的一个方法，就是postLink
              },
              // 这个方法不会再执行了
              link: function(scope, ele, attrs, ctrl) {
                  console.log('我还会执行吗')
              }
            }
          })

</pre>
